<template>
  <div>
    <el-form
      ref="formDataRef"
      :model="formData"
      :label-position="labelPosition"
      label-width="100px"
    >
      <!-- <more-panel @queryMethods="queryMethods" @emptyData="emptyData" :custListInfo="true"> -->
      <more-panel mode="1" title="查询条件">
        <el-row :gutter="10" slot="fixed">
          <el-col :span="5">
            <div class="grid-content bg-purple">
              <el-form-item label="客户名称" label-width="70px">
                <el-input
                  placeholder="请输入内容"
                  v-model="formData.custName"
                  class="input-with-select"
                >
                  <el-select
                    v-model="formData.custNameType"
                    slot="append"
                    placeholder="请选择"
                    class="select-box"
                    @change="custNameChange"
                  >
                    <el-option label="精确" value="1"></el-option>
                    <el-option label="模糊" value="2"></el-option>
                  </el-select>
                </el-input>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="5">
            <div class="grid-content bg-purple">
              <el-form-item
                label="客户编码"
                class="u-ipt"
                prop="oldPartyCode"
                label-width="70px"
              >
                <el-input
                  placeholder="请输入内容"
                  v-model="formData.oldPartyCode"
                  class="input-with-select"
                >
                  <el-select
                    v-model="formData.oldPartyCodeType"
                    slot="append"
                    placeholder="请选择"
                    class="select-box"
                    @change="oldPartyCodeTypeChange"
                  >
                    <el-option
                      v-for="item in custCodeQueryType"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-input>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="6"
            ><div class="grid-content bg-purple">
              <el-form-item label="营销责任地">
                <dic-customer-select
                  :value="formData.commonRegionName"
                  title="营销责任地"
                  ref="commonRegionNameRef"
                  size="50%"
                  @inLoadAjax="commonRegionAjax"
                >
                  <!-- 表单 -->
                  <el-form
                    :inline="false"
                    label-width="80px"
                    :model="commonRegionNameForm"
                    ref="commonRegionNameFormRef"
                  >
                    <el-row :gutter="10">
                      <el-col :span="10">
                        <div class="grid-content bg-purple">
                          <el-form-item label="地区标识" class="u-ipt">
                            <el-input
                              placeholder=""
                              v-model="commonRegionNameForm.identityRegion"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="10">
                        <div class="grid-content bg-purple">
                          <el-form-item label="地区名称" class="u-ipt">
                            <el-input
                              placeholder="请输入内容"
                              v-model="commonRegionNameForm.regionName"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="4">
                        <el-button
                          type="primary"
                          size="small"
                          @click="commonRegionQuery"
                          >查询</el-button
                        >
                      </el-col>
                    </el-row>
                  </el-form>

                  <DicTable
                    ref="commonRegionTable"
                    stripe
                    highlight-current-row
                    :columnData="commonRegionNameColumns"
                    :tableData="commonRegionNameTableData"
                    :loading="commonRegionNameTableLoading"
                    :currentPage="commonRegionNameTablePage.pageIndex"
                    :pageSize="commonRegionNameTablePage.pageSize"
                    :pager="true"
                    @current-change="commonRegionNameCurrentChangeEvent"
                    @on-page-change="commonRegionNameHandlePageChange"
                  >
                    <template #opt="{ row }">
                      <el-button type="text" @click="editRow(row)"
                        >明细</el-button
                      >
                    </template>
                  </DicTable>
                </dic-customer-select>
              </el-form-item>
            </div></el-col
          >
          <el-col :span="5"
            ><div class="grid-content bg-purple">
              <el-form-item
                label="行业类型"
                prop="industryName"
                label-width="70px"
              >
                <dic-customer-select
                  :value="formData.industryName"
                  title="请选择行业类型"
                  ref="industyRef"
                  size="50%"
                  @inLoadAjax="industryCdAjax"
                >
                  <input
                    v-model="filterName"
                    class="searchType"
                    placeholder="搜索"
                    @keyup="searchEvent"
                  />
                  <div class="m-tree-box">
                    <vxe-grid
                      border
                      size="medium"
                      max-height="500"
                      :tree-config="custListindustryTableTreeConfig"
                      resizable
                      ref="xTree"
                      :data="custListindustryTableData"
                      :columns="custListindustryTableColumn"
                      @cell-dblclick="custListCellDBLClickEvent"
                    >
                    </vxe-grid>
                  </div>
                </dic-customer-select>
              </el-form-item></div
          ></el-col>
          <el-col :span="3">
            <el-button type="primary" @click="queryMethods">查询</el-button>
            <el-button type="primary" @click="emptyData">重置</el-button>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="5"
            ><div class="grid-content bg-purple">
              <el-form-item
                label="直管类型"
                prop="controlType"
                label-width="70px"
              >
                <el-select
                  v-model="formData.controlType"
                  @change="controlTypeChange"
                >
                  <el-option
                    v-for="item in selectInfo[0].val"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  >
                  </el-option>
                </el-select>
              </el-form-item></div
          ></el-col>
          <el-col :span="5"
            ><div class="grid-content bg-purple">
              <el-form-item
                label="客户经理"
                prop="custManager"
                label-width="70px"
              >
                <dic-customer-select
                  :value="formData.custManager"
                  title="选择客户经理A"
                  size="50%"
                  ref="custManagerRef"
                  @inLoadAjax="custManagerHandel"
                >
                  <!-- 表单 -->
                  <el-form
                    :inline="false"
                    label-width="80px"
                    :model="custManagerForm"
                    ref="custManagerFormRef"
                  >
                    <el-row :gutter="10">
                      <el-col :span="8">
                        <div class="grid-content bg-purple">
                          <el-form-item
                            label="员工编码"
                            class="u-ipt"
                            prop="STAFF_CODE"
                          >
                            <el-input
                              placeholder=""
                              v-model="custManagerForm.STAFF_CODE"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="8">
                        <div class="grid-content bg-purple">
                          <el-form-item
                            label="员工名称"
                            class="u-ipt"
                            prop="STAFF_NAME"
                          >
                            <el-input
                              placeholder="请输入内容"
                              v-model="custManagerForm.STAFF_NAME"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="8">
                        <div class="grid-content bg-purple">
                          <el-form-item
                            label="组织名称"
                            class="u-ipt"
                            prop="ORG_NAME"
                          >
                            <el-input
                              placeholder="请输入内容"
                              v-model="custManagerForm.ORG_NAME"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="8">
                        <div class="grid-content bg-purple">
                          <el-form-item
                            label="手机号码"
                            class="u-ipt"
                            prop="telNumber"
                          >
                            <el-input
                              placeholder="请输入内容"
                              v-model="custManagerForm.telNumber"
                              class="input-with-select"
                            >
                            </el-input>
                          </el-form-item>
                        </div>
                      </el-col>
                      <el-col :span="8">
                        <el-button
                          type="primary"
                          size="small"
                          @click="queryCustManagerId"
                          >查询</el-button
                        >
                      </el-col>
                    </el-row>
                  </el-form>
                  <!-- 表格 -->
                  <el-table
                    :data="custManagerTable"
                    border
                    :header-cell-style="{
                      background: '#F2F2F2',
                      color: '#333',
                    }"
                    @row-click="custManagerDialogRow"
                    class="commonRegionName-table"
                  >
                    <el-table-column property="STAFF_CODE" label="员工编码">
                    </el-table-column>
                    <el-table-column property="STAFF_NAME" label="员工名称">
                    </el-table-column>
                    <el-table-column property="ORG_NAME" label="组织名称">
                    </el-table-column>
                    <el-table-column
                      property="DEPARTMENT_NAME"
                      label="部门名称"
                    >
                    </el-table-column>
                    <el-table-column
                      property="MOBILE_PHONE"
                      label="移动电话"
                    >
                    </el-table-column>
                    <!-- <el-table-column property="telNumber" label="移动电话">
                    </el-table-column> -->
                  </el-table>
                  <el-pagination
                    background
                    @size-change="custManagerHandleSizeChange"
                    @current-change="custManagerHandleCurrentChange"
                    :current-page="querycustManagerDialog.pageIndex"
                    :page-sizes="[5, 10, 15, 20]"
                    :page-size="querycustManagerDialog.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="querycustManagerDialog.pageCount"
                    class="m-pagination"
                  >
                  </el-pagination>
                </dic-customer-select>
              </el-form-item></div
          ></el-col>

          <el-col :span="6"
            ><div class="grid-content bg-purple">
              <el-form-item label="客户状态">
                <el-select
                  @change="custStatusChange"
                  v-model="formData.custStatusCd"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in formData.custStatus"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item></div
          ></el-col>
          <el-col :span="5"
            ><div class="grid-content bg-purple">
              <el-form-item label="是否合规" prop="custReal" label-width="70px">
                <el-select v-model="formData.custReal" placeholder="请选择">
                  <el-option
                    v-for="item in formData.custRealArr"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item></div
          ></el-col>
        </el-row>
        <el-row style="display: none">
          <el-col :span="6"
            ><div class="grid-content bg-purple">
              <el-form-item label="客户名称与身份证是否一致">
                <el-radio-group
                  v-model="formData.isCardConsistent"
                  class="radio-mt"
                >
                  <el-radio :label="1">是</el-radio>
                  <el-radio :label="2">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </div></el-col
          >
        </el-row>
      </more-panel>
    </el-form>
    <div class="m-table-box" v-if="tableShow">
      <DicTable
        ref="myCustTableRef"
        class="m-table"
        align="center"
        border="full"
        max-height="350"
        stripe
        :columnData="tableColumns"
        :tableData="tableData"
        :loading="tableLoading"
        :currentPage="query.pageIndex"
        :pageSize="query.pageSize"
        :totalResult="query.rowCount"
        :pager="true"
        @on-page-change="handlePageChange"
      >
        <template #custName="{ row }">
          <i
            v-if="!row.identityType || row.identityType == ''"
            class="sfz whg"
          ></i>
          <i v-else-if="row.identityType == '1'" class="sfz dsh"></i>
          <i v-else class="sfz yhg"></i>
          <span>{{ row.custName }}</span>
        </template>
        <template #partyNbr="{ row }">
          <text-dialog-model
            :text="row.partyNbr"
            type="1"
            color="blue"
            title="证件详情"
            size="85%"
            btnShow="1"
            @showDialog="cardDetailHandel(row)"
          >
            <el-row class="el-row" :gutter="6">
              <el-col :span="4">
                <div class="grid-content bg-purple">
                  <div class="demo-image__placeholder">
                    <!-- <div class="block">
                      <el-image
                        :src="src"
                        class="u-image"
                        fit="cover"
                        :preview-src-list="srcList"
                        :z-index="3000"
                      ></el-image>

                    </div> -->
                    <div class="block" style="text-align: center">
                      <el-image
                        v-if="!src"
                        fit="scale-down"
                        :src="require('@/assets/imgs/wjz.jpg')"
                        :preview-src-list="[require('@/assets/imgs/wjz.jpg')]"
                        :z-index="3000"
                        class="img"
                      >
                      </el-image>
                      <el-image
                        v-else
                        fit="scale-down"
                        :src="src"
                        :preview-src-list="srcList"
                        :z-index="3000"
                        class="img"
                      >
                      </el-image>
                    </div>
                  </div></div
              ></el-col>
              <el-col :span="20"
                ><div class="grid-content bg-purple m-cust-info">
                  <div>
                    <h3 class="u-info-title">
                      {{ name }}
                    </h3>
                    <el-row :gutter="6">
                      <el-col
                        :span="8"
                        v-for="(item, index) in dataArr[0]"
                        :key="index"
                        class="flexCol"
                      >
                        <el-col :span="10" class="u-name"
                          >{{ item.name }}：</el-col
                        >
                        <el-col :span="14" class="u-value"
                          >{{ item.value }}

                          <span
                            v-if="
                              item.flag != 0 && item.sysUser && item.value != ''
                            "
                            class="u-btn"
                          >
                            <template>
                              <el-button
                                type="text"
                                @click="partyNumberInfoToView(item.flag, index)"
                                size="mini"
                                class="u-toView-btn"
                              >
                                查看
                              </el-button>
                            </template>
                          </span>
                        </el-col>
                      </el-col>
                      <el-col
                        :span="20"
                        style="min-height: 35px; margin-top: 5px"
                      >
                        <el-col :span="4" class="u-name">注册地址： </el-col>
                        <el-col :span="20" class="u-value">
                          {{ dataArr[1][0].value }}
                        </el-col>
                      </el-col>
                      <el-col :span="20">
                        <el-col :span="4" class="u-name">经营范围： </el-col>
                        <el-col :span="20" class="u-value">
                          {{ dataArr[2][0].value }}
                        </el-col>
                      </el-col>
                    </el-row>
                  </div>
                </div></el-col
              >
            </el-row>
          </text-dialog-model>
        </template>
        <template #opration="{ row }">
          <el-button type="text" @click="changeNameHandel(row, 'compliance')"
            >合规性认证</el-button
          >
          <el-button type="text" @click="whiteSet(row)"
            >白名单设置</el-button
          >
        </template>
        <template #statusCd="{ row }">
          <div v-if="row.statusCd == '1000' && row.auditStatusCd == '1110'">
            未生效-未送审
          </div>
          <div v-if="row.statusCd == '1000' && row.auditStatusCd == undefined">
            未生效-未送审
          </div>
          <div v-if="row.statusCd == '1000' && row.auditStatusCd == '1120'">
            未生效-审核中
          </div>
          <div v-if="row.statusCd == '1000' && row.auditStatusCd == '1130'">
            未生效-审核不通过
          </div>
          <div v-if="row.statusCd == '1100'">有效</div>
          <div v-if="row.statusCd == '1300'">无效</div>
        </template>
      </DicTable>
      <ul v-if="true" class="exp flex">
        <li><i class="sfz yhg mtop"></i>已合规-正式身份证</li>
        <li><i class="sfz dsh mtop"></i>已合规-临时身份证</li>
        <li><i class="sfz whg mtop"></i>未合规</li>
      </ul>
    </div>
    <el-dialog
      :title="changeNameTitle"
      append-to-body
      :visible.sync="isShow"
      v-if="isShow"
      :isShow.sync="isShow"
      width="40%"
    >
      <component
        v-bind:is="whichComp"
        :data="changeNameForm"
        @subitForm="subitForm"
        @cancelHandel="cancelHandel"
      ></component>
    </el-dialog>
    <white-dialog v-if="whiteDialogShow" @closeDialog="closeDialog"></white-dialog>
  </div>
</template>
<script>
import MorePanel from "@/components/public/MorePanel/index";
import DicCustomerSelect from "@/components/customer/form/DicCustomerSelect";
import DicTable from "@/components/public/DicTable";
import DicCustomerBtnDrawer from "@/components/customer/form/DicCustomerBtnDrawer";
import ChangeName from "@/views/customer/customer-dialog/ChangeName";
import Compliance from "@/views/customer/customer-dialog/Compliance";
import NewKeyPerson from "@/views/customer/customer-dialog/NewKeyPerson";
import CustomerInfoManageServer from "@/api/customer/CustomerInfoManageServer";
import TextDialogModel from "@/components/customer/dialog/TextDialogModel";
import InputDrawer from "@/components/public/forms/InputDrawer";
import inputDialogA from "@/components/public/forms/inputDialoga";
import whiteDialog from "@/views/customer/components/whiteDialog";
import { mapState } from "vuex";
import XEUtils from "xe-utils";

export default {
  name: "MyCustomer",
  props: {
    tableDataList: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {
      filterName: "", //行业类型搜索input框
      isShow: false,
      complianceIsShow: false,
      //客户编码-查询类型
      custCodeQueryType: [
        {
          value: "1",
          label: "精确",
        },
        {
          value: "2",
          label: "模糊",
        },
      ],
      whichComp: Compliance,
      // 我的客户表单样式
      formData: {
        // 客户编码
        oldPartyCode: "",
        // 营销责任地id
        regionId: "",
        // 营销责任地名称
        commonRegionName: "",
        // 客户编码-默认展示的值
        oldPartyCodeType: "1",
        //直管类型
        controlType: "",
        // 行业类型
        industryTypeId: "",
        // 行业类型code
        industryName: "",
        // 是否合规
        custReal: "",
        // 客户名称
        custName: "",
        // 客户名称的默认选中的value
        custNameType: "1",
        // 客户经理
        custManagerId: "",
        // 客户经理名称
        custManager: "",
        // 客户状态
        custStatus: [
          {
            value: "",
            label: "请选择",
          },
          {
            value: "1",
            label: "有效",
          },
          {
            value: "2",
            label: "未生效-未送审",
          },
          {
            value: "3",
            label: "未生效-审核中",
          },
          {
            value: "4",
            label: "未生效-审核不通过",
          },
        ],
        // 是否合规
        custRealArr: [
          {
            value: "",
            label: "请选择",
          },
          {
            value: "1",
            label: "是",
          },
          {
            value: "0",
            label: "否",
          },
        ],
        // 客户状态选中的值
        custStatusCd: "",
        // 客户名称与身份证是否一致
        isCardConsistent: "1",
      },
      // 客户列表 tabs切换按钮样式
      tabsData: [
        {
          name: "我的客户",
          icon: "el-icon-edit",
        },
        {
          name: "我管控的客户",
          icon: "el-icon-edit",
        },
        {
          name: "客户查询",
          icon: "el-icon-edit",
        },
      ],
      // form lebel 对齐方式
      labelPosition: "left",
      // 查询后台列表分页参数
      query: {
        pageIndex: 1, //当前页码
        pageSize: 10, //每页多少条
        rowCount: 0, //总条数
        pageCount: 0, //总页数
      },
      // 客户列表 表格
      tableColumns: [
        // { type: "id", width: 50, fixed: null },
        { field: "oldPartyCode", title: "客户编码", width: 200 },
        {
          slotName: "custName",
          title: "客户名称",
          minWidth: 200,
          showOverflow: true,
        },
        {
          slotName: "partyNbr",
          title: "政企客户身份证",
          width: 200,
          showOverflow: true,
        },
        {
          field: "industryTypeName",
          title: "行业类型",
          width: 150,
          showOverflow: true,
        },
        {
          field: "regionName",
          title: "营销责任地",
          width: 200,
          showOverflow: true,
        },
        {
          field: "controlTypeName",
          title: "直管类型",
          width: 100,
          showOverflow: true,
        },
        {
          field: "custManagerName",
          title: "客户经理",
          width: 100,
          showOverflow: true,
        },
        {
          field: "createDate",
          title: "创建时间",
          width: 100,
          showOverflow: true,
        },
        {
          slotName: "statusCd",
          title: "客户状态",
          width: 100,
          showOverflow: true,
        },
        { slotName: "opration", title: "操作", width: 150, fixed: "right" },
      ],
      // 客户列表-数据
      tableData: [],
      tableLoading: false,
      tablePage: {
        currentPage: 1,
        pageSize: 10,
        totalResult: 0,
      },
      // 营销责任地 表单
      commonRegionNameForm: {
        identityRegion: "", //地区标识
        regionName: "", //地区名称
      },
      //营销责任地弹窗显示隐藏
      commonRegionNameDialogVisible: false,
      // 营销责任地弹窗里分页的参数
      queryCommonRegionIdDialog: {
        pageIndex: 1, //当前页码
        pageSize: 5, //每页多少条
        rowCount: 0, //总条数
        pageCount: 0, //总页数
      },
      //    --------营销责任地 start------------------
      commonRegionNameColumns: [
        // { type: "id", width: 50, fixed: null },
        { field: "COMMON_REGION_ID", title: "地区标识" },
        { field: "REGION_NAME", title: "地区名称" },
      ],
      commonRegionNameTableData: [],
      commonRegionNameTableLoading: false,
      // 营销责任地分页
      commonRegionNameTablePage: {
        pageIndex: 1,
        pageSize: 3,
        totalResult: 0,
      },
      // 客户列表--客户经理弹窗表单
      custManagerForm: {
        STAFF_CODE: "",
        STAFF_NAME: "",
        ORG_NAME: "",
        telNumber: "",
      },
      // 客户列表--客户经理表格数据
      custManagerTable: [],
      // 客户列表--客户经理表格分页
      querycustManagerDialog: {
        pageIndex: 1, //当前页码
        pageSize: 5, //每页多少条
        rowCount: 0, //总条数
        pageCount: 0, //总页数
      },

      // 修改基本信息弹窗参数
      modifyBasicInfo: {
        type: "1",
      },
      dataArr: [
        [
          { name: "统一社会信用代码", value: "", flag: "1", sysUser: false },
          { name: "证件类型", value: "", flag: "0" },
          { name: "证件号码", value: "", flag: "2", sysUser: false },
          { name: "身份证类型", value: "", flag: "0" },
          { name: "身份证编码", value: "", flag: "0" },
          { name: "身份证有效期", value: "", flag: "0" },
          { name: "客户简称", value: "", flag: "0" },
          { name: "机构类型", value: "", flag: "0" },
          { name: "行业类型", value: "", flag: "0" },

          { name: "登记管理部门名称", value: "", flag: "0" },
          { name: "经济类型", value: "", flag: "0" },
          { name: "法定代表人姓名", value: "", flag: "0" },
          { name: "注册资本", value: "", flag: "0" },
          { name: "成立日期", value: "", flag: "0" },
          { name: "发照日期", value: "", flag: "0" },
          { name: "经营状态", value: "", flag: "0" },
          { name: "发证机关", value: "", flag: "0" },
          { name: "生产经营地址", value: "", flag: "0" },
        ],
        [{ name: "注册地址", value: "", flag: "0" }],
        [{ name: "经营范围", value: "", flag: "0" }],
      ],
      isAuditIdShow: false,
      tableShow: false,
      name: "",
      // 客户详情
      src: "",
      srcList: [],
      changeDataParams: {
        partyId: "",
        custId: "",
      },
      // 改名改证件
      changeNameForm: {
        flag: "compliance",
        custId: "",
        partyId: "",
        statusCd: "", //进入改名改证件 用来判断 审核人是否显示的字段
      },
      // 改名改证件-证件类型是否显示
      ChangeNamecardTypeIsShow: false,

      cardTypeArr: [
        { value: "15", label: "组织机构代码证" },
        { value: "34", label: "事业单位法人证书" },
        { value: "43", label: "社会团体法人登记证书" },
        { value: "49", label: "统一社会信用代码证书" },
        { value: "56", label: "律师事务所执业许可证" },
        { value: "57", label: "民办非企业单位登记证书" },
        { value: "58", label: "外国驻华新闻机构证" },
        { value: "59", label: "境外非政府组织代表机构登记证书" },
        { value: "6", label: "营业执照" },
        { value: "60", label: "基金会法人登记证书" },
        {
          value: "61",
          label: "基层群众性自治组织特别法人统一社会信用代码证书",
        },
        { value: "62", label: "业主大会统一社会信用代码证书" },
        { value: "63", label: "外国在华文化中心登记证" },
        { value: "64", label: "港澳台地区旅游部门常驻代表机构批准登记证" },
        { value: "65", label: "外国政府旅游部门常驻代表机构批准登记证" },
        { value: "66", label: "宗教活动场所登记证" },
        { value: "67", label: "宗教院校许可证" },
        {
          value: "68",
          label: "港澳新闻机构常驻内地记者站登记证",
        },
        { value: "69", label: "工会法人资格证书" },
        { value: "7", label: "单位介绍信/公函+公章（仅用于党政军客户）" },
        {
          value: "70",
          label: "中国国际贸易促进委员会行业委员会统一社会信用代码证书",
        },
        { value: "71", label: "中华人民共和国统一社会信用代码证书" },
        { value: "72", label: "境外证件" },
        { value: "73", label: "农村集体经济组织登记证书" },
        { value: "74", label: "外国律师事务所驻华代表处执业许可证" },
        { value: "75", label: "医疗机构执业许可证" },
      ],

      changeNameindustryCdTree: [],

      // 下拉框的取值
      selectInfo: [
        {
          flag: "control_type", //直管类型
          val: [],
        },
        {
          flag: "cert_type", //改名改证件直管类型
          val: [],
        },
      ],
      //  改名改证件校验规则
      rules: {
        custName: [
          { required: true, message: "请输入客户名称", trigger: "blur" },
        ],
        cardType: [
          { required: true, message: "在请输入证件类型", trigger: "blur" },
        ],
        cardNumber: [
          { required: true, message: "在请输入证件号码", trigger: "blur" },
        ],
        cardAddress: [
          { required: true, message: "在请输入证件地址", trigger: "blur" },
        ],
      },
      labelPosition: "left",
      //行业类型
      industryTypeColumns: [
        { type: "seq", width: 60, title: "序号", fixed: "left" },
        { field: "custName", title: "客户名称", width: 100, fixed: "left" },
        { field: "controlLevel", title: "管控级别", width: 100, fixed: "left" },
      ],

      // 客户列表行业类型
      custListindustryTableData: [],
      originData:[],
      custListindustryTableColumn: [
        { field: "industryTypeName", title: "行类类型名称", treeNode: "true" },
      ],
      custListindustryTableTreeConfig: {
        children: "children",
        iconOpen: "el-icon-remove",
        iconClose: "el-icon-circle-plus",
        expandAll: false, // 默认是否全部展开
      },

      // 改名改证件  -选择党政军-行业类型
      changeNameindustryTableData: [],
      changeNameindustryTableColumn: [
        { field: "industryTypeName", title: "行类类型名称", treeNode: "true" },
      ],
      changeNameindustryTableTreeConfig: {
        children: "children",
        iconOpen: "el-icon-remove",
        changeNameiconClose: "el-icon-circle-plus",
        accordion: true, // 一层只允许展开一个节点
        expandAll: false, // 默认是否全部展开
      },
      whiteDialogShow:false,//白名单显示弹窗
    };
  },
  components: {
    MorePanel,
    DicCustomerSelect,
    DicTable,
    DicCustomerBtnDrawer,
    ChangeName,
    Compliance,
    NewKeyPerson,
    TextDialogModel,
    InputDrawer,
    inputDialogA,
    whiteDialog,
  },
  created() {
    // this.resetForm();
  },
  computed: {
    ...mapState("user", ["user"]),
  },
  mounted() {
    this.$nextTick(function () {
      // this.getCustList();
      this.initValue();
    });
  },
  methods: {
    // 初始化客户列表  ·
    async getCustList() {
      var _this = this;
      var params = {
        searchFlag: "3",
        custName: this.formData.custName, //客户名称
        custNameType: this.formData.custNameType,
        oldPartyCode: this.formData.oldPartyCode, //客户编码
        oldPartyCodeType: this.formData.oldPartyCodeType,
        regionId: this.formData.regionId, //营销责任地id
        controlType: this.formData.controlType, //管控类型
        industryTypeId: this.formData.industryTypeId, //行业类型
        isRealname: this.formData.custReal, //是否合规
        custManagerId: this.formData.custManagerId, //客户
        custStatusCd: this.formData.custStatusCd, //客户状态
        empeeId: this.user.staffId,
        pageIndex: this.query.pageIndex, //请求多少页
        pageSize: this.query.pageSize, //每页多少条
        desenFlag: 1,
      };
      const response = await CustomerInfoManageServer.getCustListJson(params);
      if (response.code == 200) {
        this.tableShow = true;
        let custManagerName;
        _this.tableData = response.meta.customers || [];
        _this.tableData.forEach(function (value) {
          value.createDate =
            value.createDate.substring(0, 4) +
            "-" +
            value.createDate.substring(4, 6) +
            "-" +
            value.createDate.substring(6, 8);
          if (value.custManagerNameB) {
            custManagerName =
              value.custManagerNameA + " " + value.custManagerNameB;
          } else {
            custManagerName = value.custManagerNameA;
          }

          //   if(value.statusCd == '1000'&& value.auditStatusCd == '1110'){
          //     value.statusCd="未生效-未送审"
          //   }
          //  if (value.statusCd== '1000' && value.auditStatusCd == undefined) {
          //      value.statusCd='未生效-未送审';
          //   }
          //   if (value.statusCd == '1000' && value.auditStatusCd == '1120') {
          //         value.statusCd= '未生效-审核中';
          //   }
          //   if (value.statusCd == '1000' && value.auditStatusCd == '1130') {
          //       value.statusCd= '未生效-审核不通过';
          //   }
          //   if (value.statusCd  == '1100') {
          //         value.statusCd='有效';
          //     }
          //   if (value.statusCd  == '1300') {
          //       value.statusCd='无效';
          //     }
          value.custManagerName = custManagerName;
        });

        //总条数
        this.query.rowCount = Number(response.meta.pageInfo.rowCount);
        this.query.pageCount = Number(response.meta.pageInfo.pageCount);
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    async getPhoto(path) {
      if (path) {
        const response = await CustomerInfoManageServer.getCustPhoto({
          photoPath: path,
        });
        if (response.code == 200) {
          this.src = response.meta.base64;
          this.srcList.push(response.meta.base64);
        }
      } else {
        this.src = "";
        this.srcList = [];
      }
    },
    // 直管类型初始化
    async initValue() {
      let response = "";
      this.selectInfo.forEach(async (item, index) => {
        response = await CustomerInfoManageServer.initValue({
          flag: item.flag,
        });
        if (response.code == 200) {
          this.selectInfo[index].val = response.meta.customers;
        } else {
          this.$notify.error({
            title: "错误",
            message: response.msg,
          });
        }
      });
    },

    //  改名改证件初始化方法
    async initChangeName(partyId, custId) {
      this.changeNameForm.custId = custId;
      this.changeNameForm.partyId = partyId;

      let params = {
        partyId,
        custId,
      };
      let result = await CustomerInfoManageServer.initGetPartyNews(params);
      let res = result.meta;
      
      
      this.changeNameForm.partyName = res.party.partyName;
      this.changeNameForm.certType = res.party.partyCert.certType;
      this.changeNameForm.certNum = res.party.partyCert.certNum;
      // 证件地址
      this.changeNameForm.certAddr = res.party.partyCert.certAddr;
      // 行业类型
      this.changeNameForm.industryTypeId = res.party.partyOrg.industryTypeId;

      this.changeNameForm.extPartyId = res.party.extPartyId;
      
    },
    // 改名改证件点击保存
    submitChangeForm(str) {
      if (str == "changeName") {
        this.isShow = false;
        this.submitChangeName();
      } else {
        this.complianceIsShow = false;
        this.submitChangeName();
      }
    },

    // 改名改证件保存方法-合规性认证保存方法
    async submitChangeName() {
      let params = {
        partyName: this.changeNameForm.partyName,
        certType: this.changeNameForm.certType,
        certNum: this.changeNameForm.certNum,
        photoName: this.changeNameForm.photoName,
        photoPath: this.changeNameForm.photoPath,
        staffId: this.user.staffId,
        industryTypeId: this.changeNameForm.industryTypeId,
        certAddr: this.changeNameForm.certAddr,
        custId: this.changeNameForm.custId,
        partyId: this.changeNameForm.partyId,
        auditor: "",
        extPartyId: this.changeNameForm.extPartyId,
      };

      let result = await CustomerInfoManageServer.changeNameSave(params);
      let res = result.meta;
      this.getCustList();
    },

    // 点击改名改证件执行的方法
    changeNameHandel(row, flag) {
      (this.changeNameForm.flag = "compliance"),
        (this.changeNameTitle = "合规性认证");
      this.checkCustAudit(row, flag);
      this.changeNameForm.statusCd = row.statusCd;
      this.changeNameForm.partyId = row.partyId;
      this.changeNameForm.custId = row.custId;
      this.changeNameForm.oldPartyCode = row.oldPartyCode;
      this.changeNameForm.regionId = row.regionId;
    },
    //白名单设置弹窗显示
    whiteSet(row){
      this.whiteDialogShow = true;
    },

    // 客户是否在审核中服务权限
    // 客户是否在审核中服务权限
    async checkCustAudit(row, flag) {
      let params = {
        custId: row.custId,
        custAuditKind: "2",
      };
      let result = await CustomerInfoManageServer.checkCustAudit(params);
      let res = result.meta;
      if (result.code == 200) {
        // 0 代表不在审核中
        if (res.COUNT != 0) {
          this.isShow = false;
          this.$alert("客户已在审核中，不能进行客户合规性验证操作！", "警告", {
            type: "warning",
            confirmButtonText: "关闭",
          });
        } else {
          this.isShow = true;
        }
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    //改名改证件初始化方法
    auditIdAjax() {},
    // 行业类型初始化
    industryCdAjax() {
      // 客户树行业类型
      this.getCustTreeList();
    },
    //获取客户树list
    async getCustTreeList() {
      const response = await CustomerInfoManageServer.getIndustryType();
      
      
      if (response.code == 200) {
        this.custListindustryTableData = response.meta;
        this.originData = response.meta
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    // 创建一个防反跳策略函数，调用频率间隔 500 毫秒
    searchEvent: XEUtils.debounce(
      function () {
        this.handleSearch();
      },
      500,
      { trailing: true }
    ),
    // 行业类型查询事件
    handleSearch() {
      let filterName = XEUtils.toValueString(this.filterName).trim();
      if (filterName) {
        let options = { children: "children" };
        let searchProps = ["industryTypeName"];
        this.custListindustryTableData = XEUtils.searchTree(
          this.originData,
          (item) =>
            searchProps.some(
              (key) => XEUtils.toValueString(item[key]).indexOf(filterName) > -1
            ),
          options
        );
        // 搜索之后默认展开所有子节点
        this.$nextTick(() => {
          this.$refs.xTree.setAllTreeExpand(true);
        });
      } else {
        this.custListindustryTableData = this.originData;
      }
    },
    // 营销责任地ajax
    async commonRegionAjax() {
      const response = await CustomerInfoManageServer.getCommonRegionList({
        COMMON_REGION_ID: this.commonRegionNameForm.identityRegion,
        REGION_NAME: this.commonRegionNameForm.regionName,
        pageIndex: this.query.pageIndex, //请求多少页
        pageSize: this.query.pageSize, //每页多少条
      });
      if (response.code == 200) {
        this.commonRegionNameTableData = response.meta.customers;
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    // 营销责任地查询
    commonRegionQuery() {
      this.commonRegionAjax();
    },
    // 分页获取每页多少条
    custManagerHandleSizeChange(val) {
      this.querycustManagerDialog.pageSize = val;
      this.custManagerAjax();
    },
    // 客户经理分页获取当前页
    custManagerHandleCurrentChange(val) {
      
      this.querycustManagerDialog.pageIndex = val;
      this.custManagerAjax();
    },
    // 客户编码下拉框val
    oldPartyCodeTypeChange(val) {
      this.formData.oldPartyCodeType = val;
    },
    // 查询方法
    queryMethods() {
      // 查询
      this.getCustList();
    },
    //重置表单
    emptyData() {
      this.formData = {
        // 客户编码
        oldPartyCode: "",
        // 营销责任地id
        regionId: "",
        // 营销责任地名称
        commonRegionName: "",
        // 客户编码-默认展示的值
        oldPartyCodeType: "1",
        //直管类型
        controlType: "",
        // 行业类型
        industryTypeId: "",
        // 行业类型code
        industryName: "",
        // 是否合规
        custReal: "",
        // 客户名称
        custName: "",
        // 客户名称的默认选中的value
        custNameType: "1",
        // 客户经理
        custManagerId: "",
        // 客户经理名称
        custManager: "",
        // 客户状态
        custStatus: [
          {
            value: "",
            label: "请选择",
          },
          {
            value: "1",
            label: "有效",
          },
          {
            value: "2",
            label: "未生效-未送审",
          },
          {
            value: "3",
            label: "未生效-审核中",
          },
          {
            value: "4",
            label: "未生效-审核不通过",
          },
        ],
        // 是否合规
        custRealArr: [
          {
            value: "",
            label: "请选择",
          },
          {
            value: "1",
            label: "是",
          },
          {
            value: "0",
            label: "否",
          },
        ],
        // 客户状态选中的值
        custStatusCd: "",
        // 客户名称与身份证是否一致
        isCardConsistent: "1",
      };
    },
    //直管类型下拉框
    controlTypeChange() {
      
    },
    // 客户名称查询
    custNameChange(val) {
      
      this.custNameType = val;
      // 1代表青精确 2代表模糊
    },
    // 客户状态
    custStatusChange(val) {
      
      
      this.formData.custStatusCd = val;
    },

    // 营销责任地弹窗分页
    commonRegionNameHandlePageChange(val) {
      
      
      this.commonRegionNameTablePage.pageIndex = val.currentPage;
      this.commonRegionNameTablePage.pageSize = val.pageSize;
      this.commonRegionAjax();
    },
    //  营销责任地获取点击当前行的数据
    commonRegionNameCurrentChangeEvent(val) {
      this.formData.regionId = val.data[val.$rowIndex].COMMON_REGION_ID;
      this.formData.commonRegionName = val.data[val.$rowIndex].REGION_NAME;
      this.$refs.commonRegionNameRef.drawer = false;
    },
    // 客户经理点击事件
    custManagerHandel() {
      this.$nextTick(() => {
        this.$refs.custManagerFormRef.resetFields();
      });
      this.querycustManagerDialog.pageIndex = 1;
      this.querycustManagerDialog.pageSize = 5;
      this.custManagerAjax();
    },
    // 客户经理初始化方法
    async custManagerAjax() {
      const response = await CustomerInfoManageServer.getManagerList({
        STAFF_CODE: this.custManagerForm.STAFF_CODE,
        ORG_NAME: this.custManagerForm.ORG_NAME,
        STAFF_NAME: this.custManagerForm.STAFF_NAME,
        pageIndex: this.querycustManagerDialog.pageIndex, //请求多少页
        pageSize: this.querycustManagerDialog.pageSize, //每页多少条
        ORG_ID:this.user.orgId
      });
      if (response.code == 200) {
        this.custManagerTable = response.meta.customers;
        this.querycustManagerDialog.pageCount =
          response.meta.pageInfo.pageCount;
        this.querycustManagerDialog.rowCount = response.meta.pageInfo.rowCount;
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    // 客户经理查询方法
    queryCustManagerId() {
      this.custManagerAjax();
    },
    // 客户经理点击表格事件
    custManagerDialogRow(val) {
      
      this.$nextTick(() => {
        this.$refs.custManagerFormRef.resetFields();
      });

      this.formData.custManager = val.STAFF_NAME;
      (this.formData.custManagerId = val.STAFF_ID),
        (this.$refs.custManagerRef.drawer = false);
    },

    resetForm() {
      this.$nextTick(() => {
        this.$refs.custManagerFormRef.resetFields();
      });
    },
    // 客户列表分页
    handlePageChange(val) {
      this.query.pageIndex = val.currentPage;
      this.query.pageSize = val.pageSize;
      
      
      this.getCustList();
    },
    //证件详情ajax加载
    async cardDetailHandel(row) {
      this.rowDetail = row;
      const result = await CustomerInfoManageServer.getDesensPriv({
        sysUserId: this.user.sysUserId,
      });
      if (result.code == 200) {
        if (result.meta.NUM_COUNT != 0) {
          this.dataArr[0][0].sysUser = true;
          this.dataArr[0][2].sysUser = true;
        }
      }
      this.cardDetailInfo(row.partyId);
    },
    //证件详情ajax加载
    async cardDetailInfo(partyId, custId) {
      let params = {
        partyId,
        custId,
        desenFlag: 1,
      };
      
      const response = await CustomerInfoManageServer.initGetPartyNews(params);

      if (response.code == 200) {
        let result = response.meta;
        this.partyCertId = this.isNull(result.party.partyCert.partyCertId);
        this.getPhoto(result.party.partyCert.photoPath);
        this.name = this.isNull(result.party.partyName);
        // 统一社会信用代码
        this.dataArr[0][0].value = this.isNull(result.party.partyCert.orgUscc);
        // 证件类型
        this.dataArr[0][1].value = this.isNull(
          result.party.partyCert.certTypeName
        );
        //  证件号码
        this.dataArr[0][2].value = this.isNull(result.party.partyCert.certNum);
        // 身份证类型
        this.dataArr[0][3].value = this.isNull(result.party.identityTypeName);
        // 身份证编码
        this.dataArr[0][4].value = this.isNull(result.party.partyNbr);
        // 身份证有效期
        this.dataArr[0][5].value =
          this.isNull(result.party.idExpDate) != ""
            ? result.party.idExpDate.substring(0, 4) +
              "-" +
              result.party.idExpDate.substring(4, 6) +
              "-" +
              result.party.idExpDate.substring(6, 8)
            : "";
        // 客户简称
        this.dataArr[0][6].value = this.isNull(result.party.partyAbbrname);
        // 机构类型
        this.dataArr[0][7].value = this.isNull(
          result.party.partyOrg.orgPropertyName
        );
        // 行业类型
        this.dataArr[0][8].value = this.isNull(
          result.party.partyOrg.industryName
        );
        // 登记管理部门名称
        this.dataArr[0][9].value = this.isNull(
          result.party.partyOrg.registerOrg
        );
        // 经济类型
        this.dataArr[0][10].value = this.isNull(
          result.party.partyOrg.econTypeName
        );
        //法定代表人姓名
        this.dataArr[0][11].value = this.isNull(
          result.party.partyOrg.legalRepr
        );
        //注册资本
        this.dataArr[0][12].value = this.isNull(
          result.party.partyOrg.orgAssets
        );
        //成立日期
        this.dataArr[0][13].value =
          this.isNull(result.party.partyOrg.custBuildDate) != ""
            ? result.party.partyOrg.custBuildDate.substring(0, 4) +
              "-" +
              result.party.partyOrg.custBuildDate.substring(4, 6) +
              "-" +
              result.party.partyOrg.custBuildDate.substring(6, 8)
            : "";
        //发照日期
        this.dataArr[0][14].value =
          this.isNull(result.party.partyCert.issuedate) != ""
            ? result.party.partyCert.issuedate.substring(0, 4) +
              "-" +
              result.party.partyCert.issuedate.substring(4, 6) +
              "-" +
              result.party.partyCert.issuedate.substring(4, 6)
            : "";
        //经营状
        this.dataArr[0][15].value = this.isNull(
          result.party.partyOrg.busiStatusCdName
        );
        //发证机关
        this.dataArr[0][16].value = this.isNull(result.party.partyOrg.certorg);
        //生产经营地址
        this.dataArr[0][17].value = this.isNull(result.party.partyOrg.orgAddr);
        //注册地址
        this.dataArr[1][0].value = this.isNull(
          result.party.partyOrg.registerAddr
        );
        //经营范围
        
        this.dataArr[2][0].value = this.isNull(result.party.partyOrg.busiScope);
      } else {
        this.$notify.error({
          title: "错误",
          message: response.msg,
        });
      }
    },
    //证件详情 查看
    async partyNumberInfoToView(item, index) {
      let parmas;
      if (item == 1) {
        parmas = {
          flag: "orgUscc",
          custId: this.rowDetail.custId,
          partyCertId: this.partyCertId,
          partyId: this.rowDetail.partyId,
          staffName: this.user.staffName,
          staffCode: this.user.staffCode,
        };
      } else {
        parmas = {
          flag: "certNum",
          custId: this.rowDetail.custId,
          partyCertId: this.partyCertId,
          partyId: this.rowDetail.partyId,
          staffName: this.user.staffName,
          staffCode: this.user.staffCode,
        };
      }
      const response = await CustomerInfoManageServer.getDesensAttr(parmas);
      if (response.code == 200) {
        if (item == 1) {
          this.dataArr[0][0].value = response.meta.resultValue;
          this.dataArr[0][0].sysUser = false;
        } else {
          this.dataArr[0][2].value = response.meta.resultValue;
          this.dataArr[0][2].sysUser = false;
        }
      }
    },

    // 判断值是否存在
    isNull(val) {
      if (
        val == "NaN" ||
        val == "null" ||
        val == "undefined" ||
        val == undefined
      ) {
        return (val = "");
      } else {
        return val;
      }
    },
    format(val) {
      var time = new Date(parseInt(val));
      var y = time.getFullYear();
      var m = time.getMonth() + 1;
      var d = time.getDate();
      return y + "-" + this.add0(m) + "-" + this.add0(d);
    },
    add0(m) {
      return m < 10 ? "0" + m : m;
    },

    // 客户列表-行业类型
    custListCellDBLClickEvent(data) {
      this.$refs.industyRef.drawer = false;
      this.formData.industryTypeId = data.row.industryTypeCode;
      // 获取行业类型的code
      this.formData.industryName = data.row.industryTypeName;
    },
    subitForm() {
      this.isShow = false;
      this.getCustList();
    },
    cancelHandel() {
      this.isShow = false;
    },
    //弹窗关闭事件
    closeDialog() {
      this.whiteDialogShow = !this.whiteDialogShow;
    },
  },
};
</script>
<style lang="scss" scoped>
.u-tabs-btn {
  text-align: center;
  display: inline-block;
  list-style: none;
  width: 100%;
  height: 0.5rem;
  line-height: 0.5rem;
  background-color: #fbfbfb;
  color: #0052d9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.15rem;
  cursor: pointer;
  border-radius: 5px;
  border: 1px solid #f0f0f0;
}
.current {
  background-color: #404752;
  color: #f0f0f0;
}
.radio-mt {
  margin-top: 10px;
}
.el-icon-plus {
  border: 1px dashed #d9d9d9;
}

.select-box {
  width: 100px;
  padding: 0;
}
.table {
  margin-top: 20px;
}
.m-pagination {
  margin: 20px auto;
  text-align: center;
}
.name-wrapper {
  display: inline-block;
  width: 30%;
}
.name-wrapper button {
  padding: 0;
}
.el-input.is-disabled .el-input__inner {
  cursor: pointer !important;
}
.commonRegionId-table .el-table__body-wrapper table tbody tr {
  cursor: pointer !important;
}
.m-tree-box {
  padding: 0.2rem;
}
.commonRegionId-table {
  margin-top: 20px;
}
.u-tabgs-btn {
  display: inline-block;
  line-height: 0.3rem;

  cursor: pointer;
}
.el-popper {
  display: block !important;
  z-index: 21000;
}
.m-title {
  margin-top: 20px;
  margin-bottom: 20px;
  color: #0052d9;
  font-size: 12px;
}
.m-title .icon {
  float: left;
  display: block;
  width: 4px;
  height: 12px;
  background: #f56f3c;
  margin-top: 2px;
  margin-right: 10px;
  font-size: 14px;
}
.el-drawer__header {
  display: none !important;
}
.el-drawer__title {
  display: none !important;
}
.flexCol {
  display: flex;
  height: 40px;
  align-items: center;
}
.m-cust-info .u-name {
  color: #666;
  text-align: right;
}
.m-cust-info .u-value {
  color: #999;
}
.m-cust-info .u-info-title {
  font-size: 0.16rem;
  margin: 0 0.1rem;
  margin-bottom: 0.1rem;
  font-weight: bold;
  padding: 0 0 0.15rem 0.15rem;
  color: #666;
  margin-bottom: 0.2rem;
  border-bottom: 2px solid #f6f6f6;
}
.u-toView-btn {
  margin-left: 0.05rem;
}
.u-image {
  height: 3.5rem;
}
.m-table {
  margin-top: 0.2rem;
}
.m-row {
  padding: 0.05rem 0;
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 0.28rem;
  color: #8c939d;
  width: 1.78rem;
  height: 1.78rem;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 1.78rem;
  height: 1.78rem;
  display: block;
}
.u-select-box {
  width: 100%;
}
.el-form-item {
  padding: 0 0.1rem !important;
}
.el-select {
  width: 100%;
}
.select-box {
  width: 0.8rem;
}
.u-point {
  display: inline-block;
  width: 4px;
  height: 4px;
  background: #666;
  border-radius: 50%;
  float: left;
  margin-top: 0.13rem;
  margin-right: 0.1rem;
}
.m-table-box {
  position: relative;
}
.exp {
  position: absolute;
  bottom: 8px;
  li {
    margin-right: 0.1rem;
  }
}
.sfz {
  float: left;
  width: 0.15rem;
  height: 0.15rem;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 0.07rem;
  margin-right: 0.05rem;
  &.yhg {
    background-image: url("~@/assets/imgs/order/p_yihegui.png");
  }
  &.whg {
    background-image: url("~@/assets/imgs/order/p_weihegui.png");
  }
  &.dsh {
    background-image: url("~@/assets/imgs/order/p_daihegui.png");
  }
}
.mtop {
  margin-top: 0.02rem;
}
.m-table ::v-deep .vxe-body--row .vxe-body--column:nth-child(2) .c--tooltip {
  text-align: left;
}
.searchType {
  height: 25px;
  width: 200px;
  margin-left: 0.2rem;
}
</style>
